<!-- 
兑换优惠券、运费券 
 -->
<template>
	<view>
		<view class="discount">
			<view class="discounteach marginAuto blockbg" v-for="(item,index) in disdata" :key="index">
				<view class="diseachl">
					<view class="diseachly" style="top:-35rpx;"></view>
					<view class="diseachly" style="bottom:-35rpx;"></view>
					<view class="diseachl-moeny" v-if="item.coupon_type == 0">
						<text style="font-size:24rpx;">￥</text>
						<text style="font-size:50rpx;">{{ item.amount }}</text>
					</view>
					<view class="diseachl-moeny" v-if="item.coupon_type == 1">
						<text style="font-size:50rpx;">{{ item.amount }}折</text>
					</view>
					<view class="diseachl-moeny" v-if="item.coupon_type == 2">
						<text style="font-size:50rpx;">免单</text>
					</view>
					<view class="diseachl-dec" v-if="item.coupon_type == 0">满{{ item.less_amount }}可用</view>
					<view class="diseachl-dec" v-if="item.coupon_type == 1">折扣券</view>
					<view class="diseachl-dec" v-if="item.coupon_type == 2">免单券</view>
				</view>
				<view class="diseachc">
					<view class="diseachc-name" v-if="item.class == 1">商品券</view>
					<view class="diseachc-name" v-if="item.class == 2">运费券</view>
					<view class="diseachc-time" style="margin-top:16rpx;">有效期至：{{ item.use_end_time }}</view>
					<!-- <view class="diseachc-time" style="color:#333333;"></view> -->
				</view>
				<view class="diseachr">
					<view class="diseachrinter">{{ item.integral }}积分</view>
					<u-button @click="usefun(item,index)" 
					:customStyle="{
					color:'#fff',
					fontSize:'30rpx',
					height:'52rpx',
					lineHeight:'52rpx',
					background:'#B9180C'
					}" shape="circle" text="兑换"></u-button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			disdata: {
				type: Array,
				default: []
			},
		},
		data() {
			return {
				
			};
		},
		onLoad() {
			
		},
		methods: {
			usefun(item){
				this.$emit('disusefun',item)
			}
		},
	};
</script>

<style scoped lang="scss">
	.blockbg {
		width: 640rpx;
		border-radius: 20rpx;
		background-color: #fff;
		padding: 24rpx;
		margin-top: 20rpx;
	}
	// .discount{
	// 	width: 100%;
	// 	height:100vh;
	// }
	// 内容部分
	.discounteach{
		position: relative;
		display: flex;
		justify-content: space-between;
		overflow: hidden;
		.diseachl{
			position: relative;
			border-right: 1px dashed #E2E2E2;
			padding-right:20rpx;
			.diseachly{
				position: absolute;
				right:-14rpx;
				width:26rpx;
				height: 26rpx;
				border-radius: 50%;
				background-color:#F4F5F6;
			}
			.diseachl-moeny{
				color: #333;
			}
			.diseachl-dec{
				font-size: 24rpx;
				color:#9E9E9E;
			}
			
		}
		.diseachc{
			width:51%;
			.diseachc-name{
				font-size: 32rpx;
				color:#333;
				line-height:44rpx;
				margin-top: 10rpx;
			}
			.diseachc-time{
				color: #999999;
				font-size: 20rpx;
				line-height:30rpx;
			}
		}
		.diseachr{
			width: 140rpx;
			height: 52rpx;
			line-height:52rpx;
			.diseachrinter{
				font-size: 24rpx;
				color:#FF4E43;
				text-align: center;
			}
		}
		.dqimg{
			position: absolute;
			left:-0rpx;
			bottom: -40rpx;
			width:200rpx;
			height: 156rpx;
		}
	}
</style>